<%@ page language="java" contentType="text/html; charset=utf-8"
    pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>角色管理</title>
<link rel="stylesheet" type="text/css" href="../../third/jquery-easyui-1.3.3/themes/default/easyui.css" >
<link rel="stylesheet" type="text/css" href="../../third/jquery-easyui-1.3.3/themes/icon.css">
<script type="text/javascript" src="../../third/jquery-easyui-1.3.3/jquery.min.js"></script>
<script type="text/javascript" src="../../third/jquery-easyui-1.3.3/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../../third/jquery-easyui-1.3.3/locale/easyui-lang-zh_CN.js"></script>

<!-- zTree_v3样式 -->
<link rel="stylesheet" href="../../third/zTree_v3/css/demo.css" type="text/css">
<link rel="stylesheet" href="../../third/zTree_v3/css/zTreeStyle/zTreeStyle.css"type="text/css">
<script type="text/javascript" src="../../third/zTree_v3/js/jquery.ztree.core.js"></script>
<script type="text/javascript" src="../../third/zTree_v3/js/jquery.ztree.excheck.js"></script>


<SCRIPT type="text/javascript">
//构建权限树

	var zTree;
	var setting = {
		view : {
			dblClickExpand : false, //双击节点时，是否自动展开父节点的标识
			showLine : true, //是否显示节点之间的连线
			fontCss : {
				'color' : 'black',
				'font-weight' : 'bold'
			}, //字体样式函数
			selectedMulti : false //设置是否允许同时选中多个节点
		},
		check : {
			//chkboxType: { "Y": "ps", "N": "ps" },
			chkStyle : "checkbox", //复选框类型
			enable : true //每个节点上是否显示 CheckBox 
		},
		data : {
			simpleData : { //简单数据模式
				enable : true,
				idKey : "id",
				pIdKey : "pid",
				name : "name",
				url : "url",
				rootPId : ""
			}
		},
		callback : {
			beforeClick : function(treeId, treeNode) {
				zTree = $.fn.zTree.getZTreeObj("user_tree");
				if (treeNode.isParent) {
					zTree.expandNode(treeNode); //如果是父节点，则展开该节点
				} else {
					zTree.checkNode(treeNode, !treeNode.checked, true, true); //单击勾选，再次单击取消勾选
				}
			}
		}
	};

	$(document).ready(function() {
		onLoadZTree();
	});
	
	//获取权限树的数据
	function onLoadZTree() {
		var treeNodes;
		$.ajax({
			async : false, //是否异步
			cache : false, //是否使用缓存
			type : 'POST', //请求方式：post
			dataType : 'json', //数据传输格式：json
			url : "../../LoadMenuTree",
			error : function() {
				//请求失败处理函数
				alert('亲，权限树请求失败！');
			},
			success : function(data) {
				//console.log(data);
				//请求成功后处理函数
				treeNodes = data; //把后台封装好的简单Json格式赋给treeNodes
			}
		});

		var t = $("#user_tree");
		t = $.fn.zTree.init(t, setting, treeNodes);
	}
</SCRIPT>


<SCRIPT type="text/javascript">
	//对角色进行授权
	function doSaveRoleAccredit() {
		//var row = selectedRows[0];
		var zTree = $.fn.zTree.getZTreeObj("user_tree");
		var nodes = zTree.getCheckedNodes();
		var tmpNode;
		var ids = "";
		for (var i = 0; i < nodes.length; i++) {
			tmpNode = nodes[i];
			if (i != nodes.length - 1) {
				ids += tmpNode.id + ",";
			} else {
				ids += tmpNode.id;
			}

		}
		//        alert(ids);
		var selectedRows = $("#dg").datagrid('getSelections');
		var row = selectedRows[0];
		var roleId = row.id;
		//       alert(roleId);
		//     var params = roleId +";"+ids;
		var params = ids;

		$.ajax({
			type : "POST",
			url : url,
			data : {
				params : params,
				tm : new Date().getTime()
			},
			dataType : 'json',
			cache : false,
			success : function(data) {
				if ("success" == data.result) {
					alert('授权成功!请重新登录!');
					parent.location.reload();
					doDialogClose();
				} else {
					alert("授权失败!");
					doDialogClose();
				}
			}
		});
	}
</SCRIPT>


<script type="text/javascript">
	//查找角色信息
	var url;
	function searchRole() { 
		//datagrid的load方法
		$('#dg').datagrid('load', {
			gradeName : $('#s_roleName').val() //这里意思是传一个gradeName参数
		});
	}
	//删除角色
	function deleteRole() { 
		//datagrid的一个方法，直接获取选中行集合，在eclipse这里设断点是进不去的，要到firefox里调试
		var selectedRows = $("#dg").datagrid('getSelections');
		if (selectedRows.length == 0) {
			$.messager.alert("系统提示:", "请选择要删除的数据");
			return;
		}
		var strIds = [];
		for (i = 0; i < selectedRows.length; i++) {
			strIds.push(selectedRows[i].id);
		}
		var ids = strIds.join(",");
		//	alert(ids);
		$.messager.confirm("系统提示", "您确认要删掉这<font color=red>" + selectedRows.length + "</font>条数据吗？", function(r) {
			if (r) {
				$.post("../../roleDelete", {
					delIds : ids
				}, function(result) {
					if (result.success) {
						$.messager.alert("系统提示", "您已成功删除<font color=red>" + result.delNums + "</font>条数据！");
						$("#dg").datagrid("reload");
					} else {
						$.messager.alert('系统提示', result.errorMsg);
					}
				}, "json");
			}
		});
	}

	//打开修改对话框
	function openRoleModifyDialog() {
		var selectedRows = $("#dg").datagrid('getSelections');
		if (selectedRows.length != 1) {
			$.messager.alert("系统提示", "请选择一条要编辑的数据！");
			return;
		}
		var row = selectedRows[0];
		$("#dig").dialog("open").dialog("setTitle", "编辑角色信息");
		$("#fm").form("load", row); //把row的数据放入对话框666~fm是对话框表单的id
		url = "../../roleSave?id=" + row.id; 
	}

	//打开授权对话框
	function openRoleAccreditDialog() {
		var selectedRows = $("#dg").datagrid('getSelections');
		if (selectedRows.length != 1) {
			$.messager.alert("系统提示", "请选择一条要授权的数据！");
			return;
		}
		var row = selectedRows[0];

		$("#openmenu").dialog("open").dialog("setTitle", "选择授权");
		$("#fm").form("load", row); //把row的数据放入对话框666~fm是对话框表单的id
		url = "../../doSaveRoleAccredit?id=" + row.id;
	}

	//打开添加对话框
	function openRoleAddDialog() {
		$("#dig").dialog("open").dialog("setTitle", "添加角色");
		url = "../../roleSave";
	}

	function closeRoleDialog() { //关闭对话框
		$("#dig").dialog("close");
		resetValue();
	}

	//保存修改或添加
	function saveRole() {
		$("#fm").form("submit", {
			url : url,
			onSubmit : function() {
				return $(this).form("validate");
			},
			success : function(result) {
				if (result.errorMsg) {
					$.messager.alert("系统提示", result.errorMsg);
					return;
				} else {
					$.messager.alert("系统提示", "保存成功");
					resetValue();
					$("#dlg").dialog("close");
					$("#dg").datagrid("reload");
					closeRoleDialog();
					return;
				}
			}
		});
	}
	function resetValue() { //把添加弹出对话框的文本置空
		$("#gradeName").val("");
		$("#gradeDesc").val("");
	}
</script>
</head>
<body style="margin:5px">
<!-- table可以加上fit="true"，看个人喜好  -->
		<table id="dg" title="角色信息" class="easyui-datagrid" fitColumns="true"
		pagination="true" rownumbers="true" url="../../RoleList" fit="true" toolbar="#tb">
				<thead>
						<tr>
							<th field="cb" checkbox="true"></th>
							<th field="id" width="50">编号</th>
							<th field="roleid" width="50">角色编号</th>
							<th field="roleName" width="100">角色名称</th>
					  </tr>
		</thead>
		</table>
		
		<div id="tb">
				<div>
						<a href="javascript:openRoleAddDialog()" class="easyui-linkbutton" iconCls="icon-add" plain="true">添加</a>
						<a href="javascript:openRoleModifyDialog()" class="easyui-linkbutton" iconCls="icon-edit" plain="true">修改</a>
						<a href="javascript:deleteRole()" class="easyui-linkbutton" iconCls="icon-remove" plain="true">删除</a>
						<a href="javascript:openRoleAccreditDialog()" class="easyui-linkbutton" iconCls="icon-ok" plain="true">授权</a>
				</div>
				<div>&nbsp;角色名称：&nbsp;<input type="text" name="s_gradeName" id="s_gradeName" />
				<!-- a标签的超链接可以去除改成自己需要的在点击a标签时触发的事件 -->
				<a href="javascript:searchRole()" class="easyui-linkbutton" iconCls="icon-search" plain="true">搜索</a>
				</div>
		</div>
		
		<div id="dig" class="easyui-dialog" closed="true" style="width:400px;height:280px;padding:10px 20px">
			<form id="fm" method="post" buttons="#dig-buttons">
				<table>
					<tr>
						<td>角色编号:</td>
						<td><input type="text" name="roleid" id="roleid" class="easyui-validatebox" required="true"></td>
					</tr>
					<tr>
						<td valign="top"角色名称:</td>
						<td><textarea rows="7" cols="30" name="roleName" id="roleName"></textarea></td>
					</tr>
				</table>
				
		<div id="dig-buttons">
			<a href="javascript:saveRole()"  class="easyui-linkbutton"  iconCls="icon-ok">保存</a>
			<a href="javascript:closeRoleDialog()"  class="easyui-linkbutton"  iconCls="icon-cancel" >取消</a>
		</div>
			</form>
		</div>

<input type="hidden">

	<div id="openmenu" class="easyui-dialog" closed="true"style="width:380px;height:460px;padding:10px 20px">
		<form id="fm" method="post" buttons="#dig-buttons">
		
		
		
		<div class="zTreeDemoBackground left">
    		<ul id="user_tree" class="ztree" style="border: 1px solid #617775;overflow-y: scroll;height: 340px;"></ul>
  		</div>
		
		

			<div id="dig-buttons">
				<a href="javascript:doSaveRoleAccredit()" class="easyui-linkbutton"iconCls="icon-ok">授权</a>
				 <a href="javascript:closeRoleDialog()"class="easyui-linkbutton" iconCls="icon-cancel">取消</a>
			</div>
		</form>
	</div>


</body>
</html>